<template>
	<div class="table-handle" :style="{ minWidth: isShow ? '170px' : '50px' }">
		<template v-if="isShow">
			<cl-table-filter :columns="columns" v-model="columnsVal" @confirm="filterConfirm">
				<icon-svg name="icon-select-1" />
			</cl-table-filter>
			<el-button style="margin-left: 10px" v-print="print">
				<icon-svg name="icon-print-1" />
			</el-button>
		</template>
		<el-button @click="exportFile">
			<icon-svg name="icon-download-3" />
		</el-button>
	</div>
</template>
<script>
	// import { exportExcel } from "@/utils/excel";
	import { baseUrl } from "@/config/env";
	export default {
		name: "cl-table-handle",
		props: {
			print: {
				type: Object,
				default: () => ({})
			},
			columns: {
				type: Array,
				default: () => []
			},
			value: {
				type: Array,
				default: () => []
			},
			// 匹配的键值
			filterKey: {
				type: String,
				default: "label"
			},
			isShow: {
				type: Boolean,
				default: true
			},
			// 是否异步下载
			isAsyncShow: {
				type: Boolean,
				default: false
			},
			// 异步下载的参数
			downQuery: {
				type: Object,
				default: () => {}
			},
			// 额外的报表参数配置
			excelDownQuery: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				columnsVal: this.value
			};
		},
		watch: {
			value: {
				immediate: true,
				handler(v) {
					this.columnsVal = v;
				}
			},
			columnsVal: {
				immediate: true,
				handler(v) {
					this.$emit("input", v);
					this.$emit("confirm", v);
				}
			}
		},
		methods: {
			//表头筛选
			filterConfirm(v) {
				this.columnsVal = v;
			},
			// 导出
			exportFile() {
				this.$emit("export-file");
				// exportExcel()
			},
			
			getFormData(data) {
				const query = {
					...data
				}
				if (query.bra_id && this._.isArray(query.bra_id)) {
					query.bra_id = query.bra_id.join(',')
				}
				if (query.date && this._.isArray(query.date)) {
					query.begin_time = query.date[0]
					query.end_time = query.date[1]
				}
				return query
			}
		}
	};
</script>
<style lang="scss" scoped>
	.table-handle {
		// display: inline-block;
		min-width: 154px;
		.async-export {
			margin-top: 6px;
			display: flex;
			align-items: center;
		}
	}
</style>
